<div class="panel">
    <form class="layui-form" action="">
        <div class="layui-form-item ProceduresPanel">
            <label class="layui-form-label">手续</label>
            <div class="layui-input-block">
                <input type="checkbox" lay-filter="payProcedures" name="payProcedures" lay-skin="switch" lay-text="出全包|出不包" >
                <input type="checkbox" lay-filter="sellProcedures" name="sellProcedures" lay-skin="switch" lay-text="收全包|收不包" >
            </div>
        </div>
    </form>
    <table  class="layui-table table scaleimgtable">
        <thead>
            <tr>
                <td>你买</td>
                <td class="scalepay">37比例</td>
                <td></td>
                <td>你卖</td>
                <td class="scalesell">42比例</td>
            </tr>
        </thead>
        <tr>
            <td class="scaleimg_scalepay" colspan="2"></td>
            <td></td>
            <td class="scaleimg_scalesell" colspan="2"></td>
        </tr>
        <tr>
            <td class="pay10">10元</td>
            <td class="pay10result warning"></td>
            <td rowspan="11" width="20px" style="color:red">&nbsp;<br/><br/><br/>主动私聊加Q都是骗子</td>
            <td class="sel10">10元</td>
            <td class="sell10resule warning"></td>
        </tr>
        <tr>
            <td class="pay20">20元</td>
            <td  class="pay20result warning"></td>
            <td class="sell10">20元</td>
            <td class="sell20resule warning"></td>
        </tr>
        <tr>
            <td class="pay30">30元</td>
            <td class="pay30result warning"></td>
            <td class="sell30">30元</td>
            <td class="sell30resule warning"></td>
        </tr>
        <tr>
            <td class="pay40">40元</td>
            <td  class="pay40result warning"></td>
            <td class="sell40">40元</td>
            <td class="sell40resule warning"></td>
        </tr>
        <tr>
            <td class="pay50">50元</td>
            <td class="pay50result warning"></td>
            <td class="sell50">50元</td>
            <td class="sell50resule warning"></td>
        </tr>
        <tr>
            <td class="pay60">60元</td>
            <td class="pay60result warning"></td>
            <td class="sell60">60元</td>
            <td class="sell60resule warning"></td>
        </tr>
        <tr>
            <td class="pay70">70元</td>
            <td class="pay70result warning"></td>
            <td class="sell70">70元</td>
            <td class="sell70resule warning"></td>
        </tr>
        <tr>
            <td class="pay80">80元</td>
            <td class="pay80result warning"></td>
            <td class="sell80">80元</td>
            <td class="sell80resule warning"></td>
        </tr>
        <tr>
            <td class="pay90">90元</td>
            <td class="pay90result warning"></td>
            <td class="sell90">90元</td>
            <td class="sell90resule warning"></td>
        </tr>
        <tr>
            <td class="pay100">100元</td>
            <td class="pay100result warning"></td>
            <td class="sell100">100元</td>
            <td class="sell100resule warning"></td>
        </tr>

        <tr>
            <td></td>
            <td>实际到账</td>

            <td></td>
            <td>实际须给</td>
        </tr>
        <tr>
            <td colspan="5">交易地点：天空之城 1009 月光酒馆门口 </td>
        </tr>
    </table>
</div>
<script>
    var payProcedures = "不包"
        ,sellProcedures = "不包";
    layui.use('form', function() {
        var form = layui.form;
        form.render();
        form.on('switch(payProcedures)', function(obj) {
            var stauts=obj.elem.checked;
            if(stauts){
                $("input[name='payProcedures']").attr("checked",true);
                payProcedures = "包" ;
            }else {
                $("input[name='payProcedures']").attr("checked",false);
                payProcedures = "不包" ;
            }
            setScale();
        });
        form.on('switch(sellProcedures)', function(obj) {
            var stauts=obj.elem.checked;
            if(stauts){
                $("input[name='sellProcedures']").attr("checked",true);
                sellProcedures = "包";
            }else {
                $("input[name='sellProcedures']").attr("checked",false);
                sellProcedures = "不包";
            }
            setScale();
        });
    });
    $(function () {
        setScale();
    });
    function  setScale() {
        $.getJSON ("getConfig", function (result) {
            var data=result["data"][0];
            $(".scaleimg_scalepay").text(payProcedures + "任何手续费");
            $(".scaleimg_scalesell").text(sellProcedures + "任何手续费");
            $(".scalepay").html( "<span style='color: red'>" + data["scale_pay"] + "</span>" + "比例");
            $(".scalesell").html("<span style='color: red'>" + data["scale_sell"] + "</span>" + "比例");
            for(var i = 1; i <= 10; i++){
                var tage= i * 10
                    ,pays = tage * data["scale_pay"]
                    ,sells = tage * data["scale_sell"];
                if(sellProcedures == "不包"){
                    sells = (sells / 0.97).toFixed(0) ;
                }
                if(payProcedures == "不包"){
                    pays = (pays * 0.97).toFixed(0) ;
                }
                $(".pay"+ tage +"result").text(pays + "万");
                $(".sell"+ tage +"resule").text(sells + "万");
            }
        });
    }
</script>